import React from 'react';
import ReactDOM from 'react-dom';
import {Provider} from 'mobx-react'
import {
    BrowserRouter,
    Route
} from 'react-router-dom';

import CarList from './CarList.jsx';
import CarOrder from './CarOrder.jsx';
import CarPay from './CarPay.jsx';

import carListStore from './CarListStore';
import carOrderStore from './CarOrderStore';
import carPayStore from './CarPayStore';


const stores = {carListStore, carOrderStore, carPayStore};
const RouterList = () => (
    <Provider {...stores}>
        <BrowserRouter>
            <div>
                <Route path="/pages/mobile/car/car.html" component={CarList}/>
                <Route path="/pages/mobile/car/carOrder" component={CarOrder}/>
                <Route path="/pages/mobile/car/carPay" component={CarPay}/>
            </div>
        </BrowserRouter>
    </Provider>
);

ReactDOM.render(
    (<RouterList/>),
    document.getElementById('root')
);